/* 兄弟元素并列写  父子元素嵌套写 */
/* 
less当中写备注有两种格式：
多行备注 会被解析到css文件
单行备注不会被解析到css文件
*/
/* 属性值 @变量名:属性值   调用  @变量名
   属性名：@变量名：属性名  调用 @{变量名}
   选择器可以定义变量
   @变量名：选择器的值  调用  @{变量名}

*/
/* 
mixin 混合  类似于js当中函数
还可以做运算

引入其他less文件 @import引入

循环


*/
* {
  margin: 0;
  padding: 0;
}
.wrap {
  /* @zero:10px;
    @{width}: @w;
    height: 500px;
    background-color: red; */
  width: 500px;
  height: 500px;
  background-color: red;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  margin: auto;
}
.wrap .middle {
  width: 300px;
  height: 300px;
  background-color: yellow;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  margin: auto;
}
.wrap .middle .inner {
  width: 100px;
  height: 100px;
  background-color: pink;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  margin: auto;
}
.wrap1 {
  width: 12px;
  height: 10px;
  background-color: #ff001e;
}
.list {
  list-style: none;
}
.list li {
  color: green;
}
.list li:nth-child(2) {
  background-color: red;
}
.test1 {
  width: 15px;
}
.test2 {
  width: 20px;
}
.test3 {
  width: 25px;
}
